<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ page import="java.util.ArrayList" %>
<%@ page import="pojo.Brand" %>
<%--  在第一行加入【JSP指令：page,include,taglib】 --%>
<%@ page contentType="text/html;charset=utf-8" language="java" %>
<c:set var="ctx" value="${pageContext.request.contextPath}"></c:set>
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>品牌管理页</title>
    <script src="js/jquery.js"></script>
    <style type="text/css">
        table {
            width: 100%;
            border-collapse: collapse;
        }

        table td {
            border: 1px solid #000;
            text-align: center;
        }

        table tr {

        }

    </style>
</head>
<body>
<h1>${LOGIN_USER.username},欢迎您
    <a href="${ctx}/logout" style="text-decoration: none">[注销]</a>
</h1>
<div>
    状态：<select id="select">
            <option value="volvo">全部状态</option>
            <option value="volvo">启用</option>
            <option value="saab">禁用</option>
        </select>
    品牌管理：<input type="text" placeholder="请输入关键词">
        <button type="submit" value="查询" id="chaxun">查询</button>
        <button type="submit" value="重置" id="chongzhi">重置</button>
        <button type="submit" value="新增" id="addBtn" style="float: right">新增</button>
        <button type="submit" value="批量删除" class="remove-batch"  style="float: right;margin-right:5px">批量删除</button>
</div>
<hr>
<table>
    <tr>
        <th>选择</th>
        <th>序号</th>
        <th>品牌名称</th>
        <th>企业名称</th>
        <th>排序</th>
        <th>品牌介绍</th>
        <th>状态</th>
        <th>操作</th>
    </tr>
    <c:forEach items="${pageBean.data}" var="brand">
        <tr id="show">
            <td><input type="checkbox" class="j-checkbox"></td>
            <td>${brand.id}</td>
            <td>${brand.brandName}</td>
            <td>${brand.companyName}</td>
            <td>${brand.ordered}</td>
            <td>${brand.description}</td>
            <td id="state" value=${brand.status}>
                <c:if test="${brand.status == 1}">
                    启用
                </c:if>
                <c:if test="${brand.status == 0}">
                    禁用
                </c:if>
            </td>
            <td><a href="${ctx}/toUpdate?id=${brand.id}">修改</a>
                <a href="${ctx}/delete?id=${brand.id}" onclick="if(confirm('确定删除?')==false)return false;">删除</a>
            </td>
        </tr>
    </c:forEach>
</table>
<script>

    function getContextPath() {
        var pathName = document.location.pathname;
        var index = pathName.substr(1).indexOf("/");
        var result = pathName.substr(0, index + 1);
        return result;
    }
    let addBtn = document.querySelector("#addBtn");
    addBtn.addEventListener('click', function () {
        window.location.href = getContextPath() + "/addBrand.jsp"
    })


</script>


<div>
    <jsp:include page="common/pageBar.jsp">
        <jsp:param name="url" value="/selectAll"/>
    </jsp:include>
</div>
<div>
    <span>当前在线人员是：${applicationScope.OnlineCount}</span>
</div>
</body>
<script>
    $(document).ready(function () {
        $("body").css("background","skyblue")
        $(".remove-batch").click(function(){
            alert("您将删除以下选中数据")
            $(".j-checkbox:checked").parents("#show").remove();
        })

        $("#chaxun").click(function(){
            $("#state").each(function(){
                alert($(this).text())
            });
    });
    })
</script>

</html>